Hace unos días me preguntaban por la forma de mostrar los códigos en algunos ejemplos, propuse una entrada explicándolo y aquí la tenemos.
Lo primero de todo es crear la caja de contenido personalizada al estar explicado con anterioridad podemos seguir esos pasos y continuamos con lo siguiente que tratará de añadir esas imágenes que vemos en la parte superior izquierda de la caja. Los ejemplos los podéis ver en esta misma entrada son esas imágenes de fondo rojo y texto blanco que nos indican la clase de código que vamos a copiar si es CSS o HTML.
En plantilla edición de html añadimos los estilos para ubicar esas imágenes, supongamos que deseo añadir una imagen que la vamos a mostrar cuando añadimos CSS añadimos entonces una clase a esa imagen que la llamaremos "css"
pre.css {
background:transparent url(url-imagen) no-repeat scroll left top;
}
Donde url-imagen lo sustituimos por la url de nuestra imagen, guardamos los cambios y en la entrada que deseamos mostrar la caja de contenido con imagen añadimos unas líneas de html con la misma clase que se asocia a esa imagen que sería lo siguiente:
<pre class="css">Contenido de la caja
</pre>
Con eso, veremos la imagen en la parte superior izquierda de nuestro contenido:
Contenido de la caja
Pero, si seguimos los pasos del enlace para personalizar la caja de contenido también tendremos que añadir <code> al principio de nuestro contenido y </code> al final, de forma que nos quedaría más o menos así:

<pre class="css"><code>Contenido de la caja
</code></pre>

¿Se puede hacer con cualquier otra imagen y contenido? puede hacerse, simplemente sustituyendo la url de la imagen y el contenido, sólo hay que entender que el nombre de la clase que añadimos asociado a esa imagen debe coincidir con el que añadimos en html para mostrar la caja de contenido.
Un último detalle, si te gustan las imágenes que se han usado en esta entrada eres libre de llevártelas pero por favor utiliza tu propia url alojándolas en tu álbum de Picasa o cualquier otro sitio.
Pequeños Soles de Noe

Querida Gem@
El enlace que has puesto en "caja de contenido personalizada" da a un link que dice: "Lo sentimos, la página que estabas buscando en el blog Gem@ BLOG no existe."

Besos

Noe

Responder
Gem@

:: Tienes razón Noe gracias por avisar y que tengas un lindo día :)

Responder
Unknown

Hola Piedra Preciosa, como estás? visitando tu casa, tratando de encontrar algo shhh es secreto :P

Responder
Gem@

:: Hola Graciela estoy muy bien gracias!! espero que tu también lo estés. Que misteriosa ummmm :X

Responder
Susy

Lo vamos a probar la pandilla familiar, ya probamos la caja y quedó estupenda pero con la imagen abajo, ahora lo probaremos así.

Besos.

Responder
Pequeños Soles de Noe

Cariños. :D

Responder
Anónimo

Que tal Gemit@, espero no molestarto con mis dudas nuevamente, vos que sabes del tema, ¿Realemte sirven los directorios estilo Blogalaxia?, de ser así, cuales son los mejores, o cual es el mejor?

Afectuosos saludos!

Responder
Gem@

:: Estupendo Susy cualquier cosa ya me dices algo :)

:: Cariños Noe :D

:: HE-MARVEL en un principio pueden servir para darse a conocer, pienso, que no es malo registrarse en directorios pero tampoco debemos esperar gran cosa.
No puedo decirte los que son mejores porque no sé como funcionan todos.

Responder
MexaaC

Muy buen aporte
GRACIAS Gem@
Te encargo porfavor un contador de visitas por post :)

Responder
Gem@

:: Gracias por el comentario N.G. - C.W.
Sobre el contador de visitas hay algunos que puedes ver en la siguiente url:
http://gemablog-.blogspot.com/2008/10/flagcounter-contador-de-visitas-con.html

http://gemablog-.blogspot.com/2007/01/histats-estadsticas.html

Si ponemos en el buscador la palabra "contador" seguramente nos proporcione alguno más ;)

Responder

Los comentarios han sido inhabilitados temporalmente. ¡GRACIAS!

:):'(:(:P:D:$;):-I:X:O|O:S

Nota: solo los miembros de este blog pueden publicar comentarios.

 


top